import React from "react";
import { TouchableOpacity, Text, View } from "react-native";

import TImage from "../../components/TImage";
import BaseComponent from "../common/BaseComponent";
import Config from "../../config";
import SizeUtils from "../../common/SizeUtils";
import PostConstants from "../../common/PostConstants";
import Constants from "../../common/Constants";
import NoticeRequestUnreadedNumAction from "../../actions/notice/NoticeRequestUnreadedNumAction";
import DataManager from "../../datas/DataManager";

const ICON_SIZE = 40;
const MAX_SHOW_NUM = 99;

export default class NoticeIcon extends BaseComponent {
  constructor(props) {
    super(props);

    this.state.noticeData = [
      { type: "quanzi_qunliao", numStr: "myQuanziQunliaoNum", num: 0 }, //圈子群聊
      { type: "quanzi_post", numStr: "myQuanziCommentsNum", num: 0 }, //圈子帖子回复
      { type: "news", numStr: "myNewsCommentsNum", num: 0 }, //新闻
      { type: "huiyuan", numStr: "myVipCardPostNum", num: 0 }, //会员服务卡
      { type: "lovething", numStr: "myLovethingNum", num: 0 }, //爱情事
      { type: "xinling", numStr: "myXinlingNum", num: 0 }, //心灵工坊
      { type: "manager", numStr: "myManagerNum", num: 0 }, //创新创效管理员
      { type: "zahupu_post", numStr: "myZHPCommentsNum", num: 0 } //杂货铺帖子回复
    ];
    this._typeIndex = {
      quanzi_qunliao: 0,
      quanzi_post: 1,
      news: 2,
      huiyuan: 3,
      lovething: 4,
      xinling: 5,
      manager: 6,
      zahupu_post: 7
    }; //这样保存起来可以减少计算量

    this.state.num = 0;
    this.state.updateAction = null;
    this._timer = null;

    this._loginModel = DataManager.getModel(Constants.MODULE_TYPE.LOGIN);
  }

  componentDidMount() {
    this._initTimer();
    this._requestData();
  }

  componentWillUnmount() {
    this._clearInterval();
  }

  _initTimer() {
    if (this._timer === null) {
      this._timer = setInterval(() => {
        this._requestData();
      }, 15000);
    }
  }

  _requestData() {
    if (this._loginModel.checkAuthorization() === true) {
      new NoticeRequestUnreadedNumAction().call(this,{type:this.props.type});
    }
  }

  _clearInterval() {
    this._timer && clearInterval(this._timer);
  }

  _dealComponentWillUpdate(nextProps, nextState) {
    super._dealComponentWillUpdate(nextProps, nextState);

    if (nextState.isResponeUpdate === true) {
      this._updateNumStr(nextState);
      nextState.isResponeUpdate = false;
      nextState.updateAction = null;
    }
  }

  _updateNumStr(nextState) {
    if (nextState.updateAction === null) {
      return;
    }
    var noticeData = null;
    if (nextState.updateAction.name === "PostRequestMyPostCommentsNumAction") {
      if (
        nextState.updateAction.data.board_type ==
        PostConstants.BORDER_TYPE.QUANZI
      ) {
        noticeData = nextState.noticeData[this._typeIndex["quanzi_post"]];
        noticeData.num = nextState["myPostCommentsNum"];
      } else if (
        nextState.updateAction.data.board_type ==
        PostConstants.BORDER_TYPE.ZAHUOPU
      ) {
        noticeData = nextState.noticeData[this._typeIndex["zahupu_post"]];
        noticeData.num = nextState["myPostCommentsNum"];
      }
    } else if (nextState.updateAction.name === "HeartRequestMsgListAction") {
      if (nextState.updateAction.data.type === 1) {
        noticeData = nextState.noticeData[this._typeIndex["lovething"]];
        noticeData.num = this._calculateMsgNum(nextState["data"]);
      } else if (nextState.updateAction.data.type === 2) {
        noticeData = nextState.noticeData[this._typeIndex["xinling"]];
        noticeData.num = this._calculateMsgNum(nextState["data"]);
      } else if (nextState.updateAction.data.type === 3) {
        noticeData = nextState.noticeData[this._typeIndex["manager"]];
        noticeData.num = this._calculateMsgNum(nextState["data"]);
      }
    } else if (nextState.updateAction.name === "NewsRequestMyNewsNumAction") {
      noticeData = nextState.noticeData[this._typeIndex["news"]];
      noticeData.num = nextState["myNewsCommentsNum"];
    } else if (
      nextState.updateAction.name === "PostRequestMyPushPostsNumAction"
    ) {
      noticeData = nextState.noticeData[this._typeIndex["huiyuan"]];
      noticeData.num = nextState["myVipCardPostNum"];
    } else if (
      nextState.updateAction.name === "QuanziRequestQunliaoUnreadedNumAction"
    ) {
      noticeData = nextState.noticeData[this._typeIndex["quanzi_qunliao"]];
      noticeData.num = nextState["myQuanziQunliaoNum"];
    }
    if (noticeData) {
      this._saveDataToModel(noticeData.type, noticeData.num);
    }
  }

  _saveDataToModel(key, num) {
    DataManager.callMethod(Constants.MODULE_TYPE.NOTICE, "saveUnreadNum", [
      key,
      num
    ]);
  }

  _calculateMsgNum(data) {
    var num = 0;
    for (var i = 0; i < data.length; i++) {
      num += data[i].unread_count;
    }
    return num;
  }

  render() {
    if (this.props.isWhite) {
      const backgroudColor = this.props.backgroudColor || "#fff";
      const fontColor = this.props.fontColor || "red";
      return (
        <TouchableOpacity
          style={{
            width: SizeUtils.translateDesignWidthToCode(ICON_SIZE + 5),
            height: SizeUtils.translateDesignWidthToCode(ICON_SIZE + 4),
            flexDirection: "row",
            alignItems: "center"
          }}
          onPress={this._onPress.bind(this)}
        >
          <TImage
            style={{ width: ICON_SIZE, height: ICON_SIZE }}
            source={require("../../../resource/images/user/notice/xiaoxi2.png")}
          />
          <View
            style={{
              position: "absolute",
              backgroundColor: backgroudColor,
              height: 12,
              width: 12,
              borderRadius: 6,
              borderColor: fontColor,
              borderWidth: SizeUtils.translateDesignNumToCode(3),
              top: 0,
              right: 0,
              alignItems: "center",
              justifyContent: "center"
            }}
          >
            <Text
              style={{
                color: fontColor,
                backgroundColor: "#fff0",
                fontSize: SizeUtils.translateFontSizeToCode(14)
              }}
            >
              {this._getNum()}
            </Text>
          </View>
        </TouchableOpacity>
      );
    }
    return (
      <TouchableOpacity
        style={{
          width: SizeUtils.translateDesignWidthToCode(ICON_SIZE + 20),
          height: SizeUtils.translateDesignWidthToCode(ICON_SIZE + 10),
          flexDirection: "row",
          alignItems: "center"
        }}
        onPress={this._onPress.bind(this)}
      >
        <TImage
          style={{ width: ICON_SIZE, height: ICON_SIZE }}
          source={require("../../../resource/images/user/notice/xiaoxi.png")}
        />
        <Text
          style={{
            position: "absolute",
            color: "#db3132",
            fontSize: SizeUtils.translateFontSizeToCode(26)
          }}
        >
          {this._getNum()}
        </Text>
      </TouchableOpacity>
    );
  }

  _getNum() {
    var numStr = "";
    var num = 0;
    for (var j = 0; j < this.state.noticeData.length; j++) {
      num += this.state.noticeData[j].num;
    }
    if (num > MAX_SHOW_NUM) {
      numStr = MAX_SHOW_NUM + "+";
    } else {
      numStr = num + "";
    }
    return numStr;
  }

  _onPress() {
    this.gotoPage(Config.pages.user_notice,{type:this.props.type});
  }
}
